/*
This Source Code Form is subject to the terms of the Mozilla Public
License, v. 2.0. If a copy of the MPL was not distributed with this
file, You can obtain one at http://mozilla.org/MPL/2.0/.

Copyright (c) 2023-present Kaleidos INC
*/

@import url("shared/vertical-menu.css");

:host {
  background: var(--color-gray10);
  block-size: 100%;
  display: block;
}

.back-to-nav {
  align-items: center;
  appearance: none;
  background: var(--color-gray20);
  border: none;
  cursor: pointer;
  display: flex;
  gap: var(--spacing-8);
  inline-size: 100%;
  padding: var(--spacing-8);

  &:hover {
    background: var(--color-gray10);

    & .project-data-name {
      color: var(--color-secondary90);
    }
  }

  &:focus-visible {
    box-shadow: inset 0 0 0 2px var(--color-secondary);
    outline: 0;
  }

  &:focus:not(:focus-visible) {
    box-shadow: none;
    outline: none;
  }
}

.back-icon {
  block-size: 1rem;
  color: var(--color-secondary);
  inline-size: 1rem;
}

.project-data {
  align-items: center;
  display: flex;
  gap: var(--spacing-8);
}

.project-data-name {
  /* stylelint-disable */

  display: -webkit-box;
  overflow: hidden;
  text-align: start;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  /* stylelint-enable */
}

@mixin vertical-menu project-settings;
